<template>
    <div class="kd-item2">
        <ul>
            <li v-for="item in dataarr">
                <div class="item">
                    <div class="item1" @click="detail(item.system_order_no)">
                        <div class="left">
                            <h1 class="font-normal font-color-normal">
                                <span class="type-name">{{item.type_name}}</span>
                                {{item.order_no}}
                            </h1>
                        </div>
                        <div class="kd">
                            <span>{{item.express_name}}</span>
                        </div>
                    </div>
                    <div class="text">
                        <h1 class="font-small font-color-normal no-line">
                            <span class="icon iconfont icon-icon"></span>快递单号：{{item.express_no}}
                            <span class="font-color-shallow right-name">取货码：<span style="color:red;">{{item.get_code}}</span></span>
                        </h1>
                        <h1 class="font-small font-color-normal no-line">
                            <span class="icon iconfont icon-geren"></span>收货人名：{{item.name}}
                            <span class="font-color-shallow right-name" @click="call(item.phone)">{{item.phone}}</span>
                        </h1>
                        <h1 class="font-normal font-color-shallow no-line">
                            <span class="icon iconfont icon-beizhu"></span>备注信息：
                            <span class="right-name">{{item.description == undefined ? 'null' : item.description}}</span>
                        </h1>
                        <h1 class="font-normal font-color-shallow">
                            <span class="icon iconfont icon-dingwei"></span>收获地址：
                            <span class="right-name">{{item.receive_address}}</span>
                        </h1>
                    </div>
                    <div class="btn-center">
                        <x-button class="btn-blue" @click.native="complate(item.order_no,item.id)">完成配送</x-button>
                    </div>
                </div>
            </li>
        </ul>
        
    </div>
</template>

<script>
import { Group, Cell,XButton } from 'vux'
export default {
    props:{
        dataarr:{
            type:Array,
            default:[]
        }
    },
    components: {
        Group,
        Cell,
        XButton
    },
    data(){
        return{

        }
    },
    mounted(){
    },
    methods:{
        call(phone){
            window.location.href = 'tel:' + phone
        },
        complate(no,id){
            let token = localStorage.getItem("access_token");
            let params = {"access_token": token,"order_no" : no,"order_id" : id}
            this.ajaxplugin("/Deliver/finish_express_order",params,(res) => {
                this.$emit('complate')
            })
        },
        detail(id){
            //this.$router.push('/detail2/'+id)
        }
    }
}
</script>

<style lang="stylus" scoped>
.kd-item2
    .item
        background #ffffff
        margin-bottom 10px
        .item1
            padding 15px 10px
            .kd
                font-size 14px
                color #2196F3
            .type-name
                color: red
                border: 1px solid #f00
                padding: 2px 5px
                font-size: 10px
                display: inline-block
                border-radius: 9px
        .text
            h1
                line-height: 30px
                padding: 0px 10px
                border-bottom: 1px solid #eee
                &.no-line
                    border-bottom none
                .right-name
                    float right
                span
                    margin-right 5px
</style>